//商品详情
function shopNew() {
    let mockData = Mock.mock({
        "logobanner": "@image(1920x115,@color)",
        "navlist|8": [{
            "text": "@ctitle(2,4)",
            "href": "#"
        }],
        "crumblist|4-6": [{
            "text": "@ctitle(4,18)",
            "href": "#"
        }],
        "chooseshowlist|3-5": ["@image(400x515,@color)"],
        "choosemsglist|3-5": [{
            "img": "@image(400x515,@color)",
            "sizelist|3-5": [{
                "text": "@ctitle(1,2)",
                "price|0-100.2": 1
            }]
        }],
        "businesspromise|3-5": [{
            "text": "@ctitle(4,6)",
            "href": "#"
        }],
        "goodsparam|8-13": [{
            "title": "@ctitle(2,4)",
            "con": "@ctitle(6,18)"
        }],
        "goodsshowimg|4": ["@image(590x750,@color)"],
        "goodssizetips|2-4": ["@ctitle(8,40)"],
        "goodssizetable": {
            "title|6": [{
                "text": "@ctitle(2,2)",
                "con|6": ["@ctitle(2,4)"]
            }],
            "prompt": "@ctitle(14,40)", //提示
        },
        "commenttag|6-12": [{
            "text": "@ctitle(2,6)",
            "num|1-99": 1,
        }],
        "commentclasslist": [{
            "text": "全部",
            "num|99-999": 1
        },
            {
                "text": "好评",
                "num|1-99": 1
            },
            {
                "text": "追评",
                "num|1-99": 1
            },
            {
                "text": "中评",
                "num|1-99": 1
            },
            {
                "text": "差评",
                "num|1-99": 1
            },
        ],
        "commentlist|5": [{
            "head": "@image(60x60,@color)",
            "name": "w***y",
            "code|1-5": 1,
            "comcon": "@ctitle(8,40)",
            "imglist|1-4": ["@image(48x48,@color)"],
            "goodsname": "@ctitle(4,8)",
            "comtime": "@date('yyyy-MM-dd HH:mm')",
            "zancur|0-1": 1,
            "zannum|0-99": 1,
            "zhuiday|1-9": 1,
            "zhuicon": "@ctitle(8,40)",
            "replycon": "@ctitle(18,40)",
            "replytime": "@date('yyyy-mm-dd')"
        }]
    });
    goodsDetails = new Vue({
        el: "#goodsDetails",
        data() {
            return {
                topparams: {
                    login: false,
                },
                price: 899,
                total: 899,
                leftShowImgSrc: "", //左侧大图的图片路径
                leftShowImgIndex: 0, //左侧大图下面处于选中状态的小图 初始默认选中第一个
                choosecolor: 0, //颜色选项 初始默认选中第一个
                choosesize: 0, //当前颜色对应的被选择的尺寸
                choosedz: 0, //定制按钮对应的选择值
                chooseniukou: 0, //纽扣样式对应的选择值
                choosesizearray: [], //保存每种颜色被选择的尺寸 choosesizearray[i]为第i个颜色选项对应选择的尺寸 默认为每种颜色的第一个尺寸
                goodsNum: 1, //商品数量 初始为1，不可低于1
                showcon: 1, //1为显示商品详情，2为显示累计评论
                commontclass: 0, //评论 顶部分类
                price: 0, //显示价格
                initPrice: 0, //尺寸初始价格  用于计算  显示价格
                productInfo: {}, //商品基本信息
                shopInfo: {}, //店铺信息
                desciption: "", //商品详情介绍
                commentlist: [], //商品评价列表
                commentType: 4, //评论类型  默认4全部评论
                pages: 0, //评论页数
                urlStream: [], //url所带参数
                couponList: [], //优惠券列表
                praiseOf: 0, //好评度
                commentNumber: 0, //评论人数
                activityFlag: null, //活动标记
                labFlag: null,
                activityId: null, //活动id
                activity: {}, //活动信息
                activityState: null, //活动状态
                timeleft: null, //剩余秒数
                time: null, //剩余秒数转换后存储的对象
                customizationVos: [], //存储定制信息
                dinzhiList:[],//定制列表
            }
        },
        methods: {
            getData() {
                let that = this;
                this.logobanner = mockData.logobanner; //
                //this.navlist = mockData.navlist;
                this.crumblist = mockData.crumblist;
                this.chooseshowlist = mockData.chooseshowlist;
                this.leftShowImgSrc = this.chooseshowlist[0];
                this.choosemsglist = []; //mockData.choosemsglist; //可选的颜色与尺寸

                this.businesspromise = mockData.businesspromise; //商家承诺
                this.goodsparam = mockData.goodsparam; //商品参数
                this.goodsshowimg = mockData.goodsshowimg; //商品展示
                this.goodssizetips = mockData.goodssizetips; //商品尺码 tips
                this.goodssizetable = mockData.goodssizetable; //尺码对照表
                this.commenttag = mockData.commenttag; //累计评论 标签
                this.commentclasslist = mockData.commentclasslist; //累计评论 顶部分类
                // this.commentlist = {}; //累计评论 评论内容

                this.urlStream = urlParam.href();

                that.activityId = this.urlStream.activityId;
                that.activityFlag = this.urlStream.activityFlag;

                //请求商品信息
                axios({
                    method: 'post',
                    params: {
                        productId: urlParam.href().productId,
                        activityId: that.activityId,
                        activityFlag: that.activityFlag,
                        token: urlParam.token()
                    },
                    url: urlParam.domain() + "/api/productInfo/getProduct",
                    responseType: 'stream'
                }).then(result => {
                    console.log(result.data.data);
                    that.productInfo = result.data.data.product;
                    that.shopInfo = result.data.data.shop;
                    that.logobanner = result.data.data.shop.pcBackground;
                    that.activity = result.data.data.activity;

                    if(result.data.data.product.isCustomized==0){
                        that.setDinzhiList();
                    }

                    if (that.activityFlag == 1) {
                        that.labFlag = "团购价格"
                    }
                    if (that.activityFlag == 2) {
                        that.labFlag = "秒杀价格"
                    }

                    if (that.activity.startTime > 0) {
                        that.timeleft = that.activity.startTime;
                        that.activityState = "距活动开始";
                    } else if (that.activity.startTime <= 0 && that.activity.endTime >= 0) {
                        that.timeleft = that.activity.endTime;
                        that.activityState = "距活动结束";
                    } else {
                        that.activityState = "活动已结束";
                    }

                    //获取优惠券
                    axios({
                        method: 'get',
                        url: urlParam.domain() + '/api/myCoupon/couponList',
                        params: {
                            token: urlParam.token(),
                            businessId: that.shopInfo.businessId
                        },
                    }).then(function(response) {
                        that.couponList = response.data.data;

                    });

                });


                //请求 左侧轮播图
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId },
                    url: urlParam.domain() + "/api/productInfo/getProduct",
                    responseType: 'stream'
                }).then(result => {
                    this.chooseshowlist = result.data.data.carousel;

                });
                //请求 商品颜色尺寸
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId },
                    url: urlParam.domain() + "/api/productInfo/productColorAndSize",
                    responseType: 'stream'
                }).then(result => {
                    this.choosemsglist = result.data.data;
                    //初始化choosesizearray
                    for (var i = 0; i < this.choosemsglist.length; i++) {
                        this.choosesizearray[i] = 0;
                    }
                    this.clickchoosecolor(0);
                    this.clickchoosesize(0);
                });

                //请求商品参数
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId },
                    url: urlParam.domain() + "/api/productInfo/productSpecParameter",
                    responseType: 'stream'
                }).then(result => {
                    this.goodsparam = result.data.data.attributeValues;
                });

                //请求商品展示详情
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId },
                    url: urlParam.domain() + "/api/productInfo/productIntroduction",
                    responseType: 'stream'
                }).then(result => {
                    this.desciption = result.data.data.desciption.replace(result.data.data.desciption ? /&(?!#?\w+;)/g : /&/g, '&amp;')
                        .replace(/&lt;/g, "<")
                        .replace(/&gt;/g, ">")
                        .replace(/&quot;/g, "\"")
                        .replace(/&#39;/g, "\'");
                });
                this.comment(urlParam.href().productId, this.pages, this.commentType, "", "");
            },
            //获取定制信息
            setDinzhiList(){
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId },
                    url: urlParam.domain() + "/api/productInfo/productCustomized",
                    responseType: 'stream'
                }).then(result => {
                    this.dinzhiList=result.data.data.customizationVos;
                });
            },
            //将剩余秒数转换为天 时 分 秒格式
            exchangeTimeLeave: function() {
                this.time = transformTimeleft(this.timeleft);
            },
            //倒计时
            countdown: function() {
                var that = this;
                setInterval(function() {
                    that.timeleft--;
                    that.exchangeTimeLeave();
                }, 1000)
            },
            comment: function(productId, pages, type, color, size) {
                //请求商品评价列表
                axios({
                    method: 'post',
                    params: { productId: urlParam.href().productId, type: type, pages: pages },
                    url: urlParam.domain() + "/api/productInfo/productComment",
                    responseType: 'stream'
                }).then(result => {
                    // this.commentlist=this.commentlist.concat(result.data.data.commentList);
                    this.commentlist = result.data.data.commentList;
                    this.commentclasslist = result.data.data.count;
                    this.praiseOf = result.data.data.praiseOf;
                })


            },
            //鼠标进入左侧大图下面的小图
            inLeftChooseImg(index) {
                this.leftShowImgIndex = index;
                this.leftShowImgSrc = this.chooseshowlist[index].path;
            },
            //计算价格
            calPrice() {
                console.log(this.choosemsglist[this.choosecolor].sizelist[this.choosesize].price);
                var price = this.choosemsglist[this.choosecolor].sizelist[this.choosesize].price - 0;
                this.price = this.total + price;
            },
            //鼠标点击选择颜色的图片
            clickchoosecolor(index) {
                this.choosecolor = index;
                this.leftShowImgSrc = this.choosemsglist[index].colorCoverPic;
                //切换到对应的被选择的尺寸
                this.choosesize = this.choosesizearray[this.choosecolor];
                this.calPrice();
            },
            //鼠标点击选择尺寸
            clickchoosesize(index) {
                this.choosesizearray[this.choosecolor] = index;
                this.choosesize = index;
                this.calPrice();
            },
            //鼠标点击是否定制
            clickchoosedz(index) {
                this.choosedz = index;
            },
            //鼠标点击选择纽扣样式
            clickchooseniukou(index) {
                this.chooseniukou = index;
            },
            calPrice() {
                this.price = this.choosemsglist[this.choosecolor].productColorSizeList[this.choosesize].price * this.goodsNum;
            },
            //点击加号
            addGoodsNum() {
                this.goodsNum += 1;
                this.calPrice();
            },
            //点击减号
            redGoodsNum() {a
                this.goodsNum > 1 && (this.goodsNum -= 1);
                this.calPrice();
            },
            //选中定制信息
            isCheckThisVal(index1,index2){
                this.dinzhiList[index1].attributeCustomizations.map((result)=>{
                    result.check = false;
                });q
                this.dinzhiList[index1].attributeCustomizations[index2].check=true;
            },
            //点击标题切换显示内容
            clicktitle(n) {
                this.showcon = n;
            },
            //点击累计评论 顶部分类
            clickCommontClass(index) {
                this.pages = 0;
                this.commontclass = index;
                if (index == 0) {
                    this.commentType = 4;
                } else if (index == 1) {
                    this.commentType = 2;
                } else if (index == 2) {
                    this.commentType = 1;
                } else if (index == 3) {
                    this.commentType = 0;
                } else if (index == 4) {
                    this.commentType = 3;
                }
                this.comment(urlParam.href().productId, this.pages, this.commentType, "", "");
            },

            //评论点击下一页
            nextPageComment() {
                this.pages += 1;
                this.comment(urlParam.href().productId, this.pages, this.commentType, "", "");
            },
            //添加到购物车
            addShopCart() {
                //判断是否登录
                userLogin.ifLogin();
                var colorObj = this.choosemsglist[this.choosecolor];
                var sizeObj = colorObj.productColorSizeList[this.choosesize];
                var product = this.productInfo;
                var goodsNum = this.goodsNum;
                var that = this;
                var params = {
                    token: urlParam.token(),
                    buyNumber: goodsNum,
                    colorName: colorObj.colorName,
                    name: product.name,
                    picImg: product.picImg,
                    productNumber: product.productNumber,
                    productPrice: sizeObj.price,
                    sellerId: product.userId,
                    sizeName: sizeObj.name
                }
                axios({
                    url: urlParam.domain() + '/api/shoppingCart/add',
                    params: params,
                    method: "post",
                    responseType: 'stream'
                }).then(result => {
                    that.$message({
                        showClose: true,
                        message: result.data.message,
                    });
                    window.location.href = '../../html/goods/goods-addcart.html';
                    sessionStorage.setItem("cart", JSON.stringify(params));
                })
            },
            //领取优惠券
            getCoupon(couponInfo) {
                //判断是否登录
                userLogin.ifLogin();
                let that = this;
                axios({
                    url: urlParam.domain() + "/api/myCoupon/getCoupons",
                    method: "post",
                    params: {
                        token: urlParam.token(),
                        StartTime: couponInfo.startTime,
                        businessId: that.shopInfo.businessId,
                        couponNo: couponInfo.couponNo,
                        couponType: couponInfo.couponType,
                        endTime: couponInfo.endTime,
                        numberLimit: 0
                    }
                }).then(result => {
                    that.$message({
                        title: '消息',
                        message: result.data.data,
                    });
                    if (result.data.data.code == 401) {
                        userLogin.clearLogin();
                    }
                })
            },
            //收藏商品
            followProduct() {
                var that = this;
                var type = this.productInfo.isFollow;
                type == 1 ? type = 0 : type = 1;
                axios({
                    method: 'get',
                    url: urlParam.domain() + '/api/productFollow/save',
                    params: {
                        productId: this.urlStream.productId,
                        type: type,
                        token: urlParam.token()
                    },
                    //  responseType: 'stream',
                }).then(function(response) {
                    console.log(response);
                    if (response.data.code == 401) {
                        userLogin.ifLogin();
                    } else {
                        that.productInfo.isFollow = type;
                    }
                });
            },

            //商品分享
            shareProduct() {
                let url = 'https://cdnjs.cloudflare.com/ajax/libs/social-share.js/1.0.16/js/social-share.min.js'
                let script = document.createElement('script')
                script.setAttribute('src', url)
                document.getElementsByTagName('head')[0].appendChild(script)
            },

            //立即购买
            nowBuyProduct() {
                userLogin.ifLogin();
                var colorObj = this.choosemsglist[this.choosecolor];
                var sizeObj = colorObj.productColorSizeList[this.choosesize];
                var product = this.productInfo;
                var goodsNum = this.goodsNum;
                formatProduct(goodsNum, product.productId, colorObj.colorName, sizeObj.name, product.productNumber, product.name, sizeObj.price, this.shopInfo["shopName"], product.picImg, product.userId);

            },
        },
        created() {
            this.getData();
            this.exchangeTimeLeave();
            this.countdown();

        },
        mounted() {

        },
        components: {
            "shop-coupon-list": shop_coupon_list
        }
    });
}

//加入购物车
function goodsAddcart() {
    let mockData = Mock.mock({

    });
    new Vue({
        el: "#goodsAddcart",
        data() {
            return {
                topparams: {
                    login: true,
                },
                topnavlist: JSON.parse(sessionStorage.getItem("cart"))
            }
        },
        methods: {
            getData() {

            },
            //商品详情
            productInfo() {
                window.history.go(-1);
            },
            //跳转购物车
            goCart() {
                window.location.href = "../../html/cart/my_cart.html";
            }
        },
        created() {
            this.getData();
        },
        mounted() {},
        components: {

        }
    });
}

//商品详情
function goodsDetailsTuan() {
    let mockData = Mock.mock({
        "logobanner": "@image(1920x115,@color)",
        "navlist|8": [{
            "text": "@ctitle(2,4)",
            "href": "#"
        }],
        "crumblist|4-6": [{
            "text": "@ctitle(4,18)",
            "href": "#"
        }],
        "chooseshowlist|3-5": ["@image(400x515,@color)"],
        "choosemsglist|3-5": [{
            "img": "@image(400x515,@color)",
            "sizelist|3-5": ["@ctitle(1,2)"]
        }],
        "businesspromise|3-5": [{
            "text": "@ctitle(4,6)",
            "href": "#"
        }],
        "goodsparam|8-13": [{
            "title": "@ctitle(2,4)",
            "con": "@ctitle(6,18)"
        }],
        "goodsshowimg|4": ["@image(590x750,@color)"],
        "goodssizetips|2-4": ["@ctitle(8,40)"],
        "goodssizetable": {
            "title|6": [{
                "text": "@ctitle(2,2)",
                "con|6": ["@ctitle(2,4)"]
            }],
            "prompt": "@ctitle(14,40)", //提示
        },
        "commenttag|6-12": [{
            "text": "@ctitle(2,6)",
            "num|1-99": 1,
        }],
        "commentclasslist": [{
            "text": "全部",
            "num|99-999": 1
        },
            {
                "text": "好评",
                "num|1-99": 1
            },
            {
                "text": "追评",
                "num|1-99": 1
            },
            {
                "text": "中评",
                "num|1-99": 1
            },
            {
                "text": "差评",
                "num|1-99": 1
            },
        ],
        "commentlist|5": [{
            "head": "@image(60x60,@color)",
            "name": "w***y",
            "code|1-5": 1,
            "comcon": "@ctitle(8,40)",
            "imglist|1-4": ["@image(48x48,@color)"],
            "goodsname": "@ctitle(4,8)",
            "comtime": "@date('yyyy-MM-dd HH:mm')",
            "zancur|0-1": 1,
            "zannum|0-99": 1,
            "zhuiday|1-9": 1,
            "zhuicon": "@ctitle(8,40)",
            "replycon": "@ctitle(18,40)",
            "replytime": "@date('yyyy-mm-dd')"
        }]
    });
    new Vue({
        el: "#goodsDetailsTuan",
        data() {
            return {
                topparams: {
                    login: false,
                },
                leftShowImgSrc: "", //左侧大图的图片路径
                leftShowImgIndex: 0, //左侧大图下面处于选中状态的小图 初始默认选中第一个
                choosecolor: 0, //颜色选项 初始默认选中第一个
                choosesize: 0, //当前颜色对应的被选择的尺寸
                choosesizearray: [], //保存每种颜色被选择的尺寸 choosesizearray[i]为第i个颜色选项对应选择的尺寸 默认为每种颜色的第一个尺寸
                goodsNum: 1, //商品数量 初始为1，不可低于1
                showcon: 1, //1为显示商品详情，2为显示累计评论
                commontclass: 0, //评论 顶部分类
            }
        },
        methods: {
            getData() {
                this.logobanner = mockData.logobanner;
                this.navlist = mockData.navlist;
                this.crumblist = mockData.crumblist;
                this.chooseshowlist = mockData.chooseshowlist;
                this.leftShowImgSrc = this.chooseshowlist[0];
                this.choosemsglist = mockData.choosemsglist; //可选的颜色与尺寸
                //初始化choosesizearray
                for (var i = 0; i < this.choosemsglist.length; i++) {
                    this.choosesizearray[i] = 0;
                }
                this.businesspromise = mockData.businesspromise; //商家承诺
                this.goodsparam = mockData.goodsparam; //商品参数
                this.goodsshowimg = mockData.goodsshowimg; //商品展示
                this.goodssizetips = mockData.goodssizetips; //商品尺码 tips
                this.goodssizetable = mockData.goodssizetable; //尺码对照表
                this.commenttag = mockData.commenttag; //累计评论 标签
                this.commentclasslist = mockData.commentclasslist; //累计评论 顶部分类
                this.commentlist = mockData.commentlist; //累计评论 评论内容
            },
            //鼠标进入左侧大图下面的小图
            inLeftChooseImg(index) {
                this.leftShowImgIndex = index;
                this.leftShowImgSrc = this.chooseshowlist[index];
            },
            //鼠标点击选择颜色的图片
            clickchoosecolor(index) {
                this.choosecolor = index;
                this.leftShowImgSrc = this.choosemsglist[index].img;
                //切换到对应的被选择的尺寸
                this.choosesize = this.choosesizearray[this.choosecolor];
            },
            //鼠标点击选择尺寸
            clickchoosesize(index) {
                this.choosesizearray[this.choosecolor] = index;
                this.choosesize = index;
            },
            //点击加号
            addGoodsNum() {
                this.goodsNum += 1;
            },
            //点击减号
            redGoodsNum() {
                this.goodsNum > 1 && (this.goodsNum -= 1);
            },
            //点击标题切换显示内容
            clicktitle(n) {
                this.showcon = n;
            },
            //点击累计评论 顶部分类
            clickCommontClass(index) {
                this.commontclass = index;
            }
        },
        created() {
            this.getData();
        }
    });
}